/**
 * @/router/index.js
 * 全局路由管理器
 *
 * 集中管理导航栏视图的切换
 */

import { createRouter, createWebHistory } from "vue-router";
import { useUserStore } from "@/stores";
import { ElMessage } from "element-plus";
import HomePage from "@/views/home/Page.vue";
import NewsPage from "@/views/news/Page.vue";
import CulturePage from "@/views/culture/Page.vue";
import ProtectionPage from "@/views/protection/Page.vue";
import ServiceTravelPagePage from "@/views/service/ServiceTravelPage.vue";
import ServiceFoodPage from "@/views/service/ServiceFoodPage.vue";
import ServiceProductPage from "@/views/service/ServiceProductPage.vue";
import ServiceInnPage from "@/views/service/ServiceInnPage.vue";
import MerchantPage from "@/views/admin/MerchantPage.vue";
import TownPage from "@/views/admin/TownPage.vue";
import UserPage from "@/views/admin/UserPage.vue";
import WebPage from "@/views/admin/WebPage.vue";
import LoginPage from "@/views/admin/LoginPage.vue";
import AboutPage from "@/views/about/Page.vue";
import ArticlesPage from "@/components/ArticlesPage.vue";

const routes = [
  { path: "/", component: HomePage },
  { path: "/news", component: NewsPage },
  { path: "/culture", component: CulturePage },
  { path: "/protection", component: ProtectionPage },
  { path: "/service-travel", component: ServiceTravelPagePage },
  { path: "/service-food", component: ServiceFoodPage },
  { path: "/service-product", component: ServiceProductPage },
  { path: "/service-inn", component: ServiceInnPage },
  {
    path: "/admin-merchant",
    component: MerchantPage,
    meta: { requiresMerchant: true },
  },
  {
    path: "/admin-town",
    component: TownPage,
    meta: { requiresAdmin: true },
  },
  {
    path: "/admin-user",
    component: UserPage,
    meta: { requiresAdmin: true },
  },
  {
    path: "/admin-web",
    component: WebPage,
    meta: { requiresAdmin: true },
  },
  { path: "/admin-login", component: LoginPage },
  { path: "/about", component: AboutPage },
  { path: "/articles/:id", component: ArticlesPage },
];

/* 页面路由模式 */
const router = createRouter({
  // history: createWebHashHistory(), // 使用锚点 # 机制避免切换页面路由向后端请求
  // createMemoryHistory(), // 内存 URL 历史记录模式(不会在浏览器上显示出来, 方便服务端渲染)
  history: createWebHistory(), // 后端需要支持重定向
  routes,
});

/* 页面路由守卫 */
router.beforeEach((to, from, next) => {
  // 获取路由元信息
  const requiresAdmin = to.meta.requiresAdmin;
  const requiresMerchant = to.meta.requiresMerchant;

  // 如果不需要特殊权限，则直接进入
  if (!requiresAdmin && !requiresMerchant) {
    next();
    return;
  }

  // 如果需要特殊权限的话
  // 获取全局用户状态
  const userStore = useUserStore();

  // 判断用户身份
  const isAdmin = userStore.currentUser.role === "admin";
  const isMerchant = userStore.currentUser.role === "merchant";

  // 需要管理员权限的路由的话
  if (requiresAdmin && !isAdmin) {
    // 如果路由需要管理员权限但用户不是管理员, 则重定向
    ElMessage({
      message: "您无权限访问该页面, 只有管理员才能访问",
      type: "error",
    });
    next({ path: "/" });
  }
  // 需要商家权限的路由的话
  else if (requiresMerchant && !isMerchant && !isAdmin) {
    // 如果路由需要商家权限但用户不是管理员, 则重定向
    ElMessage({
      message: "您无权限访问该页面, 只有商家或管理员才能访问",
      type: "error",
    });
    next({ path: "/" });
  }
  // 其他情况都是痛过特殊校验的
  else {
    ElMessage({
      message: "欢迎您 ~",
      type: "success",
    });
    next();
  }
});

export default router;
